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Abstract 



Many times we need to plot 3-D functions e.g., in 
many scientific experiments. To plot this 3-D func- 
tions on 2-D screen it requires some kind of map- 
ping. Though OpenGL, DirectX etc 3-D rendering 
libraries have made this job very simple, still these li- 
braries come with many complex pre-operations that 
are simply not intended, also to integrate these li- 
braries with any kind of system is often a tough trial. 
This article presents a very simple method of map- 
ping from 3 — D to 2 — D, that is free from any com- 
plex pre-operation, also it will work with any graph- 
ics systemwhere we have some primitive 2-D graphics 
function. Also we discuss the inverse transform and 
how to do basic computer graphics transformations 
using our coordinate mapping system. 



1 Introduction 

We have a function / : 5ft 2 — > 5ft, and our intention is 
to draw the function in 2 — D plane. The function 
z = ,f(x,y) is a 2-variable function and each tuple 
(x, y, f(x, y)) £ 5ft 3 . Let's say we want to graphically 
plot / onto computer screen using a primitive graph- 
ics library (like Turbo C graphics), which supports 
only the basic putPixel (to draw a pixel in 2 — D 
screen)-likc 2 — D rendering function, but no 3 — D 
rendering; i.e., our graphics library's putPixel's do- 
main is 5ft 2 and it's not 5ft 3 . 

2 Proposed Approach 

We have a pictorial representation (figure 1) of our 

3 — D to 2 — D mapping system: 

But, how the function / should look like after 
the mapping and the plotting? Here we simu- 
late the 3 rd coordinate (namely Z) in our 2 — D 
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Figure 1: Basic Model of a simple 3 — D to 2 — D 
mapping system 

x-y plane. We perform the logical to physical 
coordinate transform and everything by the map 
function h, which will basically turn out to be 
a 3 x 2 matrix. The basic mapping technique is 
shown in fig. 2, which we are going to explain shortly. 

We start with our Origin O (i.e. (0, 0, 0)) mapped to 
(^Oj Uo) screen coordinate, so that we have the follow- 
ing equations, 



xl = xq + y — x.sin{6) 

yi = 2/o - z + x.cos(9) (1) 

i.e., we have our 3 — D to 2 — D transformation 
matrix: 



M 3x2 = 



—sin{9) cos{9) 
1 
-1 



(2) 



Again we have change of origin (shifting) by the ma- 
trix (vector) O2D = [xq Vo] so that (9 2 d + P3D x 
-^3x2 = P2D1 here x denotes matrix multiplication 
and + denotes matrix addition, the 3-tuple P3D = 
[x y z], the 2-tuple P2D — [xl yl], i.e., 



[x Vo) + [x y z] 




= [xiyi] (3) 



By default we keep the angle between X— axis and 
Z— axis = 6 = ?, that one can change if required, 
but with the following inequality strictly satisfied: 
< 9 < f . 
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Figure 2: The coordinate mapping h: logical coordi- 
nate (x, y, z) 1 y physical coordinate (#/, yi), given the 
logical origin O 1— > physical origin (ccq,j/o) 



One can optionally use a compression factor to con- 
trol the dimension along Z— axis by a compression 
factor p z and slightly modifying the equations 



xl = xq + y — x.sin{6) 
yi = Vo - Pz-z + x.cos(9) (4) 

Obviously, 0.0 < p z < 1.0. By default we take p z = 
1.0. 

3 Sample output surfaces 
drawn using the above map- 
ping 

Following surfaces (Fig. 3 and Fig. 4) are drawn 
in Turbo C++ version 3.0 (BGI graphics) using the 
above simple 3 — D to 2 — D mapping. 
Also we used the same technique for a 3-D plot in 
java applet, the outputs are shown in Fig. 5. We 
used double-buffering technique for smooth drawing 
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(copying in an alternate buffer and copying it back 
to original graphic device context only when plot fin- 
ishes to avoid flickering) for better performance (since 
drawing pixel by pixel is a bit time consuming) . Also, 
we used color code mapping to have gradient effect 
in our plot. 

4 Inverse Transformation - Ob- 
taining the original 3-D 
coordinates from the trans- 
formed 2 — D coordinates 

Here, our transformation function (matrix) is de- 
fined by Eqn. (1). As we can see, it is impos- 
sible to (uniquely) re-convert and obtain the origi- 
nal set of coordinates, namely (x,y,z), because we 
have 3 unknowns and 2 equations. So, in order to 
be able to get the original coordinates back, we at 
least need to store 3 tuples as result of the trans- 
formation, for instance, (x, y, z) i— > (xl,yl,z), the z- 
coordinate being stored only to get the inverse trans- 
form (xl, yf, z) i — y (x, y, z) and the (xl, yi) pair is used 
to plot the point. Hence, in order to get the inverse 
transformation, we need to solve the equations for x, 
y, since we already know z, we have 2-equations and 
2 unknown variables: 

y — x.sin(9) = xl — xq 

x.cos(9) = y/-y + z (5) 

solving the above 2 equations we get, 



x = {yf - t/o + z).sec{9) 
y = xl - x + (yf - y Q + z).tan(9) (6) 

Put it in another way, our transformation matrix is 
a 3 x 2 matrix and is performed by Eqn. (2) since 
a non-square matrix, no question of existence of its 
inverse. So, in order to be able to get the inverse 
transform as well, we need a 3 x 3 invertible square 




Figure 3: 1) sin(x+y) 2) sin(x 2 +y 2 ) functions drawn 
in TurboC++ Version 3.0 (BGI Graphics) using the 
3 — D to 2 — D mapping, with proper scaling 
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Figure 4: 1) sm ^_ 2)sin(^ M -)cos{^ M -) functions Figure 5: 1) sin(x+y) 2) sin(x 2 +y 2 ) functions drawn 
drawn in TurboC++ Version 3.0 (BGI Graphics) us- in java applet 2D graphics using the 3 — D to 2 — D 
ing the 3 — D to 2 — D mapping, with proper scaling mapping, with proper scaling and color 
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matrix, e.g., 



here, cos(9) ^ 0. 



M- 



3x3 



-sin(6) cos(6) 0" 
1 

-1 1 



with 



Hence, the inverse transform is: 



(7) 



[x y z\ 




[xi yi z] - [s ya 0] (13) 



Det(M 3x3 ) = det 




[xy z] = [xi -x yt- y z] 




1 0' 
tan{6) 
tan(6) 1 



(14) 



-sin(6) cos{9) 
1 



--cos(6) (8) [ x y z] = [(y/ - y + z)sec(6) x/ - x + (y' - y + z)tan(6) z] (15) 



Now, < < |, hence cos(#) ^ 0, hence 
Det(M 3x3 ) 7^ 0, i.e. the matrix is non-singular and 
the inverse exists. 



[x Vo 0] + [x y z] 



But, we have, 



-sin(6) 
1 





Inv(M 3x3 ) 



M 3x \ 



Adj(M 3x3 ) 
Det(M 3x3 ) 
Det(M 3x3 ) 



and, 



Adj{M 3x3 ) 



Hence, 



-cos(6) 
—sin(6) 
—sin(0) 



Inv(M 3x3 ) 



10' 

sec(6) tan{9) 
sec(e) tan(9) 1 



[xi yi z] 



(10) 




(11) 



(12) 



This exactly matches with our previous derivation. 



Rotation and 
formations 



Affine Trans- 



A point in 3 — D, after being mapped to 2 — D 
s^ccn following the above mapping procedure, may 
be required to be transformed using standard com- 
puter graphics transformations (translation, rotation 
about an axis etc). But in order to undergo such a 
graphics transformation and to show the point back 
to the screen after the transformation, it needs to 
go through the following steps in our previously- 
described coordinate mapping system: 

1. First obtain the inverse coordinate transforma- 
tion to obtain the original 3— D coordinates from 
the mapped 2 — D coordinates. 

2. Multiply the 3 — 1? coordinate matrix by proper 
graphics transformation matrix in order to 
achieve graphical transformation. 



3. Use the same 3 — D to 2 - 
the point onto the screen. 



D map again to plot 



These steps can be mathematically represented as: 

1. P3D = P2D X (Maxs)" 1 



5 



2. Pl 3D = P 3D x (T 3x3 ) 

3. PhD = P'sd x (M 3x3 ) 
Or, by a single line expression, 

PhD = (({P2D X (M^g)- 1 ) X (T 3x3 )) X (M 3x3 )) 

Here, as before x denotes matrix multiplication, 
where T 3x3 denotes the traditional graphics trans- 
formation matrix. 

But, since we know the fact that matrix multiplica- 
tion is associative, we have, 



to undergo a T 3x3 transformation, we first need to 
compute the matrix T 3x3 , then we need to compute 
our new matrix Mil = M 3x3 x (T 3x3 ) n x M 3x3 , so we 
need total n + 2 matrix multiplications, every-time 
we want a T 3x3 transform, for each n. 

But if we have computed M 3x3 x (T 3x3 ) n x M 3x3 
initially, here the trick is that we can reuse this it to 
compute our new matrix in the following manner: 



Mil 

T 3x3 x M 3x3 ) 



^3x3 >< (^3x3) r 



x M : 



3x3 



(M. 



3x3 



(Ml) 



Pi 



2D 



(((P2D X (Mgxa)- 1 ) X (T 3x3 )) X (M 3x3 )) 



= P 2D x Mg-^ x T 3x3 x M 3x3 



Here we need not compute T 3x3 and Mil everytime, 
instead we need to compute (Mi) n only (that can be 
incremental multiplication to increase efficiency). 



where Ml 



=> PhD = P2D X Ml, 
M 3x3 x T 3x3 X M 3x3 



(i 6 jB Conclusion 



Hence, using this simple technique, we can escape 
the 3 successive matrix multiplications every-time a 
point on screen needs to transformed: instead we can 
pre-compute the matrix Ml 



M 3x3 X T 3X3 X M 3x3 . 



This matrix Ml is needed to be computed once for a 
given graphics transformation (e.g., rotation about 
an axis) and applied to all points on the screen, so 
that using a single matrix multiplication thereafter 
any point on the screen can undergo graphics 
transformation, by, PhD = P2D x Ml, where P2D 
represents the point mapped before transformation 
T 3x3 and PhD is the point re- mapped after the 
transformation, as obvious. 

Hence, using the above tricks we are able to make 
the transformation more computationally efficient. 
Moreover, if a transformation is needed to be 
applied simultaneously, we can use the property 
M 3x3 x (T 3x3 )" x M 3x3 = (M 3x \ x T 3x3 x M 3x3 )", 
where (T 3x3 )" denotes (n times, n is a positive 
integer) simultaneous matrix multiplication of 
T 3x3 . Letfs say we have already undcrgoncaT 3 x 3 
transformation, so that we have already computed 
Ml = M 3x3 x T 3x3 x M 3x3 , and let's say we also have 
frequent simultaneous T 3x3 transformation. In order 



This article presented a very simple method of map- 
ping from 3— D to 2— D, that is free from any complex 
pre-operation. The proposed technique works with 
any graphics system where we have some primitive 
2—D graphics function. We also discussed the inverse 
transform and how to do basic computer graphics 
transformations using our coordinate mapping sys- 
tem. 
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